var canvas=document.getElementById("gameCanvas") as HTMLCanvasElement;
var context = canvas.getContext("2d");
var y=50;
var image=new Image();
image.src='vn.jpg';


function enterFrame (){
if(!context){
    return;
}
y++;
canvas.width=canvas.height=400;
//context.clearRect(0,0,400,400);
context.drawImage(image,0,0)

context.save();

    context.rect(0,y,50,50);
    context.fillStyle= 'red';
    context.fill();
    context.fillStyle= 'black';

    context.fillText("hello world",100,100);

    requestAnimationFrame(enterFrame);

}
requestAnimationFrame(enterFrame);
//setInterval(enterFrame);


function regen() {
	// home
	prepareSlideshow();
	// about
	prepareInternalnav();
	// photos
	preparePlaceholder();
	prepareGallery();
	// live
	stripeTables();
	highlightRows();
	displayAbbreviations();
	// contact
	focusLabels();
    prepareForms();
    function showPic(whichpic) {
        if (!document.getElementById("placeholder")) return true;
        var source = whichpic.getAttribute("href");
        var placeholder = document.getElementById("placeholder");
        placeholder.setAttribute("src",source);
        if (!document.getElementById("description")) return false;
        if (whichpic.getAttribute("title")) {
          var text = whichpic.getAttribute("title");
        } else {
          var text = "";
        }
        var description = document.getElementById("description");
        if (description.firstChild.nodeType == 3) {
          description.firstChild.nodeValue = text;
        }
        return false;
      }
      
      function prepareGallery() {
        if (!document.getElementsByTagName) return false;
        if (!document.getElementById) return false;
        if (!document.getElementById("imagegallery")) return false;
        var gallery = document.getElementById("imagegallery");
        var links = gallery.getElementsByTagName("a");
        for ( var i=0; i < links.length; i++) {
          links[i].onclick = function() {
            return showPic(this);
          }
          links[i].onkeypress = links[i].onclick;
        }
      }
      
      function addLoadEvent(func) {
        var oldonload = window.onload;
        if (typeof window.onload != 'function') {
          window.onload = func;
        } else {
          window.onload = function() {
            oldonload();
            func();
          }
        }
      }
      
      addLoadEvent(prepareGallery);
}
// Global

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
      window.onload = func;
    } else {
      window.onload = function() {
        oldonload();
        func();
      }
    }
  }
  
  function insertAfter(newElement,targetElement) {
    var parent = targetElement.parentNode;
    if (parent.lastChild == targetElement) {
      parent.appendChild(newElement);
    } else {
      parent.insertBefore(newElement,targetElement.nextSibling);
    }
  }
  
  function addClass(element,value) {
    if (!element.className) {
      element.className = value;
    } else {
      newClassName = element.className;
      newClassName+= " ";
      newClassName+= value;
      element.className = newClassName;
    }
  }
  
  function highlightPage() {
    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;  
    var headers = document.getElementsByTagName('header');
    if (headers.length == 0) return false;
    var navs = headers[0].getElementsByTagName('nav');
    if (navs.length == 0) return false;
    
    var links = navs[0].getElementsByTagName("a");
    for (var i=0; i<links.length; i++) {
        var linkurl;
        for (var i=0; i<links.length; i++) {
          linkurl = links[i].getAttribute("href");
          if (window.location.href.indexOf(linkurl) != -1) {
            links[i].className = "here";
            var linktext = links[i].lastChild.nodeValue.toLowerCase();
            document.body.setAttribute("id",linktext);
          }
        }
    }
  }
  
  
  // Home
  
  function moveElement(elementID,final_x,final_y,interval) {
    if (!document.getElementById) return false;
    if (!document.getElementById(elementID)) return false;
    var elem = document.getElementById(elementID);
    if (elem.movement) {
      clearTimeout(elem.movement);
    }
    if (!elem.style.left) {
      elem.style.left = "0px";
    }
    if (!elem.style.top) {
      elem.style.top = "0px";
    }
    var xpos = parseInt(elem.style.left);
    var ypos = parseInt(elem.style.top);
    if (xpos == final_x && ypos == final_y) {
      return true;
    }
    if (xpos < final_x) {
      var dist = Math.ceil((final_x - xpos)/10);
      xpos = xpos + dist;
    }
    if (xpos > final_x) {
      var dist = Math.ceil((xpos - final_x)/10);
      xpos = xpos - dist;
    }
    if (ypos < final_y) {
      var dist = Math.ceil((final_y - ypos)/10);
      ypos = ypos + dist;
    }
    if (ypos > final_y) {
      var dist = Math.ceil((ypos - final_y)/10);
      ypos = ypos - dist;
    }
    elem.style.left = xpos + "px";
    elem.style.top = ypos + "px";
    var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
    elem.movement = setTimeout(repeat,interval);
  }
  
  function prepareSlideshow() {
    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
    if (!document.getElementById("intro")) return false;
    var intro = document.getElementById("intro");
    var slideshow = document.createElement("div");
    slideshow.setAttribute("id","slideshow");
    var frame = document.createElement("img");
    frame.setAttribute("src","images/frame.gif");
    frame.setAttribute("alt","");
    frame.setAttribute("id","frame");
    slideshow.appendChild(frame);
    var preview = document.createElement("img");
    preview.setAttribute("src","images/slideshow.gif");
    preview.setAttribute("alt","a glimpse of what awaits you");
    preview.setAttribute("id","preview");
    slideshow.appendChild(preview);
    insertAfter(slideshow,intro);
    var links = document.getElementsByTagName("a");
    for (var i=0; i<links.length; i++) {
      links[i].onmouseover = function() {
        var destination = this.getAttribute("href");
        if (destination.indexOf("index.html") != -1) {
          moveElement("preview",0,0,5);
        }
        if (destination.indexOf("about.html") != -1) {
          moveElement("preview",-150,0,5);
        }
        if (destination.indexOf("photos.html") != -1) {
          moveElement("preview",-300,0,5);
        }
        if (destination.indexOf("live.html") != -1) {
          moveElement("preview",-450,0,5);
        }
        if (destination.indexOf("contact.html") != -1) {
          moveElement("preview",-600,0,5);
        }
      }
    }
  }
  
  
  // About
  
  function showSection(id) {
    var sections = document.getElementsByTagName("section");
    for (var i=0; i<sections.length; i++ ) {
      if (sections[i].getAttribute("id") != id) {
        sections[i].style.display = "none";
      } else {
        sections[i].style.display = "block";
      }
    }
  }
  
  function prepareInternalnav() {
    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
    var articles = document.getElementsByTagName("article");
    if (articles.length == 0) return false;
    var navs = articles[0].getElementsByTagName("nav");
    if (navs.length == 0) return false;
    var nav = navs[0];
    var links = nav.getElementsByTagName("a");
    for (var i=0; i<links.length; i++ ) {
      var sectionId = links[i].getAttribute("href").split("#")[1];
      if (!document.getElementById(sectionId)) continue;
      document.getElementById(sectionId).style.display = "none";
      links[i].destination = sectionId;
      links[i].onclick = function() {
        showSection(this.destination);
        return false;
      }
    }
  }
  
  
  // Photos
  
  function showPic(whichpic) {
    if (!document.getElementById("placeholder")) return true;
    var source = whichpic.getAttribute("href");
    var placeholder = document.getElementById("placeholder");
    placeholder.setAttribute("src",source);
    if (!document.getElementById("description")) return false;
    if (whichpic.getAttribute("title")) {
      var text = whichpic.getAttribute("title");
    } else {
      var text = "";
    }
    var description = document.getElementById("description");
    if (description.firstChild.nodeType == 3) {
      description.firstChild.nodeValue = text;
    }
    return false;
  }
  
  function preparePlaceholder() {
    if (!document.createElement) return false;
    if (!document.createTextNode) return false;
    if (!document.getElementById) return false;
    if (!document.getElementById("imagegallery")) return false;
    var placeholder = document.createElement("img");
    placeholder.setAttribute("id","placeholder");
    placeholder.setAttribute("src","images/placeholder.gif");
    placeholder.setAttribute("alt","my image gallery");
    var description = document.createElement("p");
    description.setAttribute("id","description");
    var desctext = document.createTextNode("Choose an image");
    description.appendChild(desctext);
    var gallery = document.getElementById("imagegallery");
    insertAfter(description,gallery);
    insertAfter(placeholder,description);
  }
  
  function prepareGallery() {
    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
    if (!document.getElementById("imagegallery")) return false;
    var gallery = document.getElementById("imagegallery");
    var links = gallery.getElementsByTagName("a");
    for ( var i=0; i < links.length; i++) {
      links[i].onclick = function() {
        return showPic(this);
      }
    }
  }
  
  
  // Live
  
  function stripeTables() {
    if (!document.getElementsByTagName) return false;
    var tables = document.getElementsByTagName("table");
    for (var i=0; i<tables.length; i++) {
      var odd = false;
      var rows = tables[i].getElementsByTagName("tr");
      for (var j=0; j<rows.length; j++) {
        if (odd == true) {
          addClass(rows[j],"odd");
          odd = false;
        } else {
          odd = true;
        }
      }
    }
  }
  
  function highlightRows() {
    if(!document.getElementsByTagName) return false;
    var rows = document.getElementsByTagName("tr");
    for (var i=0; i<rows.length; i++) {
      rows[i].oldClassName = rows[i].className
      rows[i].onmouseover = function() {
        addClass(this,"highlight");
      }
      rows[i].onmouseout = function() {
        this.className = this.oldClassName
      }
    }
  }
  
  function displayAbbreviations() {
    if (!document.getElementsByTagName || !document.createElement || !document.createTextNode) return false;
    var abbreviations = document.getElementsByTagName("abbr");
    if (abbreviations.length < 1) return false;
    var defs = new Array();
    for (var i=0; i<abbreviations.length; i++) {
      var current_abbr = abbreviations[i];
      if (current_abbr.childNodes.length < 1) continue;
      var definition = current_abbr.getAttribute("title");
      var key = current_abbr.lastChild.nodeValue;
      defs[key] = definition;
    }
    var dlist = document.createElement("dl");
    for (key in defs) {
      var definition = defs[key];
      var dtitle = document.createElement("dt");
      var dtitle_text = document.createTextNode(key);
      dtitle.appendChild(dtitle_text);
      var ddesc = document.createElement("dd");
      var ddesc_text = document.createTextNode(definition);
      ddesc.appendChild(ddesc_text);
      dlist.appendChild(dtitle);
      dlist.appendChild(ddesc);
    }
    if (dlist.childNodes.length < 1) return false;
    var header = document.createElement("h3");
    var header_text = document.createTextNode("Abbreviations");
    header.appendChild(header_text);
    var articles = document.getElementsByTagName("article");
    if (articles.length == 0) return false;
    articles[0].appendChild(header);
    articles[0].appendChild(dlist);
  }
  
  
  // Contact
  
  function focusLabels() {
    if (!document.getElementsByTagName) return false;
    var labels = document.getElementsByTagName("label");
    for (var i=0; i<labels.length; i++) {
      if (!labels[i].getAttribute("for")) continue;
      labels[i].onclick = function() {
        var id = this.getAttribute("for");
        if (!document.getElementById(id)) return false;
        var element = document.getElementById(id);
        element.focus();
      }
    }
  }
  
  function resetFields(whichform) {
    if (Modernizr.input.placeholder) return;
    for (var i=0; i<whichform.elements.length; i++) {
      var element = whichform.elements[i];
      if (element.type == "submit") continue;
      if (!element.getAttribute('placeholder')) continue;
      element.onfocus = function() {
      if (this.value == this.getAttribute('placeholder')) {
        this.value = "";
       }
      }
      element.onblur = function() {
        if (this.value == "") {
          this.value = this.getAttribute('placeholder');
        }
      }
      element.onblur();
    }
  }
  
  function validateForm(whichform) {
    for (var i=0; i<whichform.elements.length; i++) {
      var element = whichform.elements[i];
      if (element.getAttribute("required") == 'required') {
        if (!isFilled(element)) {
          alert("Please fill in the "+element.name+" field.");
          return false;
        }
      }
      if (element.getAttribute("type") == 'email') {
        if (!isEmail(element)) {
          alert("The "+element.name+" field must be a valid email address.");
          return false;
        }
      }
    }
    return true;
  }
  
  function isFilled(field) {
    return (field.value.length > 1 && field.value != field.placeholder);
  }
  
  function isEmail(field) {
    return (field.value.indexOf("@") != -1 && field.value.indexOf(".") != -1);
  }
  
  function prepareForms() {
    for (var i=0; i<document.forms.length; i++) {
      var thisform = document.forms[i];
      resetFields(thisform);
      thisform.onsubmit = function() {
        if (!validateForm(this)) return false;
        var article = document.getElementsByTagName('article')[0];
        if (submitFormWithAjax(this, article)) return false;
        return true;
      }
    }
  }
  
  
  // Ajax
  
  function getHTTPObject() {
    if (typeof XMLHttpRequest == "undefined")
      XMLHttpRequest = function () {
        try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); }
          catch (e) {}
        try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); }
          catch (e) {}
        try { return new ActiveXObject("Msxml2.XMLHTTP"); }
          catch (e) {}
        return false;
    }
    return new XMLHttpRequest();
  }
  
  function displayAjaxLoading(element) {
      // Remove the existing content.
    while (element.hasChildNodes()) {
        element.removeChild(element.lastChild);
    }
    //  Create a loading image.
    var content = document.createElement("img");
    content.setAttribute("src","images/loading.gif");
    content.setAttribute("alt","Loading...");
    // Append the loading element.
    element.appendChild(content);
  }
  
  function submitFormWithAjax( whichform, thetarget ) {
    
    var request = getHTTPObject();
    if (!request) { return false; }
  
    // Display a loading message.
    displayAjaxLoading(thetarget);
  
    // Collect the data.
    var dataParts = [];
    var element;
    for (var i=0; i<whichform.elements.length; i++) {
      element = whichform.elements[i];
      dataParts[i] = element.name + '=' + encodeURIComponent(element.value);
    }
    var data = dataParts.join('&');
  
    request.open('POST', whichform.getAttribute("action"), true);
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  
    request.onreadystatechange = function () {
      if (request.readyState == 4) {
          if (request.status == 200 || request.status == 0) {
            var matches = request.responseText.match(/<article>([\s\S]+)<\/article>/);
            if (matches.length > 0) {
              thetarget.innerHTML = matches[1];
            } else {
              thetarget.innerHTML = '<p>Oops, there was an error. Sorry.</p>';
            }
          } else {
            thetarget.innerHTML = '<p>' + request.statusText + '</p>';
          }
      }
    };
  
    request.send(data);
     
    return true;
  };
  
  
  
  
  
  function loadEvents() {
    // home
    prepareSlideshow();
    // about
    prepareInternalnav();
    // photos
    preparePlaceholder();
    prepareGallery();
    // live
    stripeTables();
    highlightRows();
    displayAbbreviations();
    // contact
    focusLabels();
    prepareForms();
  }
  
  // Load events
  addLoadEvent(highlightPage);
  addLoadEvent(loadEvents);
  
  


  function draw() {
    var canvas = document.getElementById('draw-in-me');
    
        if (canvas.getContext) {
          var ctx = canvas.getContext('2d');
          ctx.beginPath();
          ctx.moveTo(120.0, 32.0);
          ctx.bezierCurveTo(120.0, 36.4, 116.4, 40.0, 112.0, 40.0);
          ctx.lineTo(8.0, 40.0);
          ctx.bezierCurveTo(3.6, 40.0, 0.0, 36.4, 0.0, 32.0);
          ctx.lineTo(0.0, 8.0);
          ctx.bezierCurveTo(0.0, 3.6, 3.6, 0.0, 8.0, 0.0);
          ctx.lineTo(112.0, 0.0);
          ctx.bezierCurveTo(116.4, 0.0, 120.0, 3.6, 120.0, 8.0);
          ctx.lineTo(120.0, 32.0);
          ctx.closePath();
          ctx.fill();
          ctx.lineWidth = 2.0;
          ctx.strokeStyle = "rgb(255, 255, 255)";
          ctx.stroke();
      }
  
  }
  window.onload = draw;
  function convertToGS(img) {
    // For good measure return if canvas isn't supported.
    if (!Modernizr.canvas) return;
    
    // Store the original color version.
    img.color = img.src;
    
    // Create a grayscale version.
    img.grayscale = createGSCanvas(img);
    
    // Swap the images on mouseover/out 
      img.onmouseover = function() {
        this.src = this.color;
      } 
      img.onmouseout = function() {
           this.src = this.grayscale; 
       }
       
       img.onmouseout();
  } 
  
  function createGSCanvas(img) {
  
      var canvas=document.createElement("canvas");
      canvas.width=img.width;
      canvas.height=img.height;
      var ctx=canvas.getContext("2d");
      ctx.drawImage(img,0,0);
      
      // Note: getImageData will only work for images 
      // on the same domain as the script. 
      var c = ctx.getImageData(0, 0, img.width, img.height); 
      for (i=0; i<c.height; i++) {
          for (j=0; j<c.width; j++) {
              var x = (i*4) * c.width + (j*4);
              var r = c.data[x]; 
              var g = c.data[x+1]; 
              var b = c.data[x+2]; 
              c.data[x] = c.data[x+1] = c.data[x+2] = (r+g+b)/3;
          }
      }
      ctx.putImageData(c,0,0,0,0, c.width, c.height);
      return canvas.toDataURL();
  }
  
  // Add a load event. 
  // use addLoadEvent function if alongside other scripts. 
(function() {

    function createVideoControls() {
      var vids = document.getElementsByTagName('video');
      for (var i = 0 ; i < vids.length ; i++) {
        addControls( vids[i] );
      }
    }
    
    function addControls( vid ) {
    
      vid.removeAttribute('controls');
    
    
      vid.height = vid.videoHeight;
      vid.width = vid.videoWidth;
      vid.parentNode.style.height = vid.videoHeight + 'px';
      vid.parentNode.style.width = vid.videoWidth + 'px';
    
      var controls = document.createElement('div');
      controls.setAttribute('class','controls');
        
      var play = document.createElement('button');
      play.setAttribute('title','Play');
      play.innerHTML = '&#x25BA;';
       
      controls.appendChild(play);
     
      vid.parentNode.insertBefore(controls, vid);
      
      play.onclick = function () {
        if (vid.ended) {
          vid.currentTime = 0;
        }
        if (vid.paused) {
          vid.play();
        } else {
          vid.pause();
        }
      };  
      
      vid.addEventListener('play', function () {
        play.innerHTML = '&#x2590;&#x2590;';
        play.setAttribute('paused', true);
      }, false);
      
      vid.addEventListener('pause', function () {
        play.removeAttribute('paused');
        play.innerHTML = '&#x25BA;';
      }, false);
      
      vid.addEventListener('ended', function () {
        vid.pause();
      }, false);
    }
    
    window.onload = function() {
      createVideoControls();
    }
    
    })()
    
    function prepareSlideshow() {
        // Make sure the browser understands the DOM methods
          if (!document.getElementsByTagName) return false;
          if (!document.getElementById) return false;
        // Make sure the elements exist
          if (!document.getElementById("linklist")) return false;
          if (!document.getElementById("preview")) return false;
        // Apply styles to the preview image
          var preview = document.getElementById("preview");
          preview.style.position = "absolute";
          preview.style.left = "0px";
          preview.style.top = "0px";
        // Get all the links in the list
          var list = document.getElementById("linklist");
          var links = list.getElementsByTagName("a");
        // Attach the animation behavior to the mouseover event
          links[0].onmouseover = function() {
            moveElement("preview",-100,0,10);
          }
          links[1].onmouseover = function() {
            moveElement("preview",-200,0,10);
          }
          links[2].onmouseover = function() {
            moveElement("preview",-300,0,10);
          }
        }
addLoadEvent(prepareSlideshow);
function moveElement(elementID,final_x,final_y,interval) {
    if (!document.getElementById) return false;
    if (!document.getElementById(elementID)) return false;
    var elem = document.getElementById(elementID);
    var xpos = parseInt(elem.style.left);
    var ypos = parseInt(elem.style.top);
    if (xpos == final_x && ypos == final_y) {
      return true;
    }
    if (xpos < final_x) {
      xpos++;
    }
    if (xpos > final_x) {
      xpos--;
    }
    if (ypos < final_y) {
      ypos++;
    }
    if (ypos > final_y) {
      ypos--;
    }
    elem.style.left = xpos + "px";
    elem.style.top = ypos + "px";
    var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
    movement = setTimeout(repeat, interval);
}
function moveElement(elementID,final_x,final_y,interval) {
    if (!document.getElementById) return false;
    if (!document.getElementById(elementID)) return false;
    var elem = document.getElementById(elementID);
    if (elem.movement) {
      clearTimeout(elem.movement);
    }
    if (!elem.style.left) {
      elem.style.left = "0px";
    }
    if (!elem.style.top) {
      elem.style.top = "0px";
    }
    var xpos = parseInt(elem.style.left);
    var ypos = parseInt(elem.style.top);
    if (xpos == final_x && ypos == final_y) {
      return true;
    }
    if (xpos < final_x) {
      var dist = Math.ceil((final_x - xpos)/10);
      xpos = xpos + dist;
    }
    if (xpos > final_x) {
      var dist = Math.ceil((xpos - final_x)/10);
      xpos = xpos - dist;
    }
    if (ypos < final_y) {
      var dist = Math.ceil((final_y - ypos)/10);
      ypos = ypos + dist;
    }
    if (ypos > final_y) {
      var dist = Math.ceil((ypos - final_y)/10);
      ypos = ypos - dist;
    }
    elem.style.left = xpos + "px";
    elem.style.top = ypos + "px";
    var repeat = "moveElement('"+elementID+"',"+final_x+","+final_y+","+interval+")";
    elem.movement = setTimeout(repeat, interval);
    
}
function prepareSlideshow() {
    // Make sure the browser understands the DOM methods
      if (!document.getElementsByTagName) return false;
      if (!document.getElementById) return false;
    // Make sure the elements exist
      if (!document.getElementById("linklist")) return false;
      var slideshow = document.createElement("div");
      slideshow.setAttribute("id","slideshow");
      var preview = document.createElement("img");
      preview.setAttribute("src","topics.gif");
      preview.setAttribute("alt","building blocks of web design");
      preview.setAttribute("id","preview");
      slideshow.appendChild(preview);
      var list = document.getElementById("linklist");
      insertAfter(slideshow,list);
    // Get all the links in the list
      var links = list.getElementsByTagName("a");
    // Attach the animation behavior to the mouseover event
      links[0].onmouseover = function() {
        moveElement("preview",-100,0,10);
      }
      links[1].onmouseover = function() {
        moveElement("preview",-200,0,10);
      }
      links[2].onmouseover = function() {
        moveElement("preview",-300,0,10);
      }
    }
addLoadEvent(prepareSlideshow);
function displayAbbreviations() {
    if (!document.getElementsByTagName || !document.createElement || !document.createTextNode) return false;
  // get all the abbreviations
    var abbreviations = document.getElementsByTagName("abbr");
    if (abbreviations.length < 1) return false;
    var defs = new Array();
  // loop through the abbreviations
    for (var i=0; i<abbreviations.length; i++) {
      var current_abbr = abbreviations[i];
      if (current_abbr.childNodes.length < 1) continue;
      var definition = current_abbr.getAttribute("title");
      var key = current_abbr.lastChild.nodeValue;
      defs[key] = definition;
    }
  // create the definition list
    var dlist = document.createElement("dl");
  // loop through the definitions
    for (key in defs) {
      var definition = defs[key];
  // create the definition title
      var dtitle = document.createElement("dt");
      var dtitle_text = document.createTextNode(key);
      dtitle.appendChild(dtitle_text);
  // create the definition description
      var ddesc = document.createElement("dd");
      var ddesc_text = document.createTextNode(definition);
      ddesc.appendChild(ddesc_text);
  // add them to the definition list
      dlist.appendChild(dtitle);
      dlist.appendChild(ddesc);
    }
    if (dlist.childNodes.length < 1) return false;
  // create a headline
    var header = document.createElement("h2");
    var header_text = document.createTextNode("Abbreviations");
    header.appendChild(header_text);
  // add the headline to the body
    document.body.appendChild(header);
  // add the definition list to the body
    document.body.appendChild(dlist);
  }
addLoadEvent(displayAbbreviations);
function stripeTables() {
    if (!document.getElementsByTagName) return false;
    var tables = document.getElementsByTagName("table");
    for (var i=0; i<tables.length; i++) {
      var odd = false;
      var rows = tables[i].getElementsByTagName("tr");
      for (var j=0; j<rows.length; j++) {
        if (odd == true) {
          addClass(rows[j],"odd");
          odd = false;
        } else {
          odd = true;
        }
      }
    }
  }
  function addClass(element,value) {
    if (!element.className) {
      element.className = value;
    } else {
      newClassName = element.className;
      newClassName+= " ";
      newClassName+= value;
      element.className = newClassName;
    }
  }
addLoadEvent(stripeTables);
function styleHeaderSiblings() {
    if (!document.getElementsByTagName) return false;
    var headers = document.getElementsByTagName("h1");
    for (var i=0; i<headers.length; i++) {
      var elem = getNextElement(headers[i].nextSibling);
      addClass(elem,"intro");
    }
  }
  function addClass(element,value) {
    if (!element.className) {
      element.className = value;
    } else {
      element.className+= " ";
      element.className+= value;
    }
  }
  function getNextElement(node) {
    if(node.nodeType == 1) {
      return node;
    }
    if (node.nextSibling) {
      return getNextElement(node.nextSibling);
    }
    return null;
  }
addLoadEvent(styleHeaderSiblings);
function displayAbbreviations() {
    if (!document.getElementsByTagName || !document.createElement || !document.createTextNode) return false;
  // get all the abbreviations
    var abbreviations = document.getElementsByTagName("abbr");
    if (abbreviations.length < 1) return false;
    var defs = new Array();
  // loop through the abbreviations
    for (var i=0; i<abbreviations.length; i++) {
      var current_abbr = abbreviations[i];
      if (current_abbr.childNodes.length < 1) continue;
      var definition = current_abbr.getAttribute("title");
      var key = current_abbr.lastChild.nodeValue;
      defs[key] = definition;
    }
  // create the definition list
    var dlist = document.createElement("dl");
  // loop through the definitions
    for (key in defs) {
      var definition = defs[key];
  // create the definition title
      var dtitle = document.createElement("dt");
      var dtitle_text = document.createTextNode(key);
      dtitle.appendChild(dtitle_text);
  // create the definition description
      var ddesc = document.createElement("dd");
      var ddesc_text = document.createTextNode(definition);
      ddesc.appendChild(ddesc_text);
  // add them to the definition list
      dlist.appendChild(dtitle);
      dlist.appendChild(ddesc);
    }
    if (dlist.childNodes.length < 1) return false;
  // create a headline
    var header = document.createElement("h2");
    var header_text = document.createTextNode("Abbreviations");
    header.appendChild(header_text);
  // add the headline to the body
    document.body.appendChild(header);
  // add the definition list to the body
    document.body.appendChild(dlist);
  }
addLoadEvent(displayAbbreviations);
window.onload = function() {
    var para = document.createElement("p");
    var txt1 = document.createTextNode("I inserted ");
    var emphasis = document.createElement("em");
    var txt2 = document.createTextNode("this");
    var txt3 = document.createTextNode(" content.");
    para.appendChild(txt1);
    emphasis.appendChild(txt2);
    para.appendChild(emphasis);
    para.appendChild(txt3);
    var testdiv = document.getElementById("testdiv");
    testdiv.appendChild(para);
  }
  window.onload = function() {
    var para = document.createElement("p");
    var txt1 = document.createTextNode("I inserted ");
    para.appendChild(txt1);
    var emphasis = document.createElement("em");
    var txt2 = document.createTextNode("this");
    emphasis.appendChild(txt2);
    para.appendChild(emphasis);
    var txt3 = document.createTextNode(" content.");
    para.appendChild(txt3);
    var testdiv = document.getElementById("testdiv");
    testdiv.appendChild(para);
  }

  window.onload = function() {
    var para = document.createElement("p");
    var txt = document.createTextNode("Hello world");
    para.appendChild(txt);
    var testdiv = document.getElementById("testdiv");
    testdiv.appendChild(para);
  }
  window.onload = function() {
    var para = document.createElement("p");
    var testdiv = document.getElementById("testdiv");
    testdiv.appendChild(para);
    var txt = document.createTextNode("Hello world");
    para.appendChild(txt);
  }
  window.onload = function() {
    var para = document.createElement("p");
    var testdiv = document.getElementById("testdiv");
    testdiv.appendChild(para);
  }
  function deepSerialize(extraData) {
    var serialized = $.param(extraData, options.traditional).split('&');
    var len = serialized.length;
    var result = [];
    var i, part;
    for (i = 0; i < len; i++) {
        // #252; undo param space replacement
        serialized[i] = serialized[i].replace(/\+/g, ' ');
        part = serialized[i].split('=');
        // #278; use array instead of object storage, favoring array serializations
        result.push([decodeURIComponent(part[0]), decodeURIComponent(part[1])]);
    }
    return result;
}

// XMLHttpRequest Level 2 file uploads (big hat tip to francois2metz)
function fileUploadXhr(a) {
    var formdata = new FormData();

    for (var i = 0; i < a.length; i++) {
        formdata.append(a[i].name, a[i].value);
    }

    if (options.extraData) {
        var serializedData = deepSerialize(options.extraData);
        for (i = 0; i < serializedData.length; i++) {
            if (serializedData[i]) {
                formdata.append(serializedData[i][0], serializedData[i][1]);
            }
        }
    }

    options.data = null;

    var s = $.extend(true, {},
    $.ajaxSettings, options, {
        contentType: false,
        processData: false,
        cache: false,
        type: method || 'POST'
    });

    if (options.uploadProgress) {
        // workaround because jqXHR does not expose upload property
        s.xhr = function() {
            var xhr = $.ajaxSettings.xhr();
            if (xhr.upload) {
                xhr.upload.addEventListener('progress',
                function(event) {
                    var percent = 0;
                    var position = event.loaded || event.position;
                    /*event.position is deprecated*/
                    var total = event.total;
                    if (event.lengthComputable) {
                        percent = Math.ceil(position / total * 100);
                    }
                    options.uploadProgress(event, position, total, percent);
                },
                false);
            }
            return xhr;
        };
    }

    s.data = null;
    var beforeSend = s.beforeSend;
    s.beforeSend = function(xhr, o) {
        //Send FormData() provided by user
        if (options.formData) {
            o.data = options.formData;
        } else {
            o.data = formdata;
        }
        if (beforeSend) {
            beforeSend.call(this, xhr, o);
        }
    };
    return $.ajax(s);
}
